<template>
  <div class="regBox">
        <van-form @submit="regFn">
            <van-field
                v-model="username"
                placeholder="请输入手机号"
                @input="telRegFn"
            />
            <div class="next">
                <van-button 
                class="nextBtn" 
                round block type="info" 
                native-type="submit" 
                :disabled="isDisabled" 
                @submit="regFn"
            >下一步</van-button>
            </div>
        </van-form>
    </div>
</template>

<script>
import { Dialog } from 'vant';
// import func from 'vue-editor-bridge';
import {docCheckPhone} from '@/api/users' 
export default {
  data() {
    return {
        username: '',
        isDisabled: true,
        telReg: /^1[0-9]{10}$/,
        show: true,
        oUserList: [],
        oUser: {},
        isReg:''
    };
  },
  methods: {
        telRegFn() {
            if (this.telReg.test(this.username)) {
                this.isDisabled = false
            } else {
                this.isDisabled = true
            }
        },
        // tipsBoxFn() {
        //     Dialog.confirm({
        //         message: '我们将发送短信验证码到您的手机号',
        //         confirmButtonText: '确定',
        //         cancelButtonColor: "#999"
        //     })
        //     .then(() => {
        //         this.$router.push('/sendCode')
        //     })
        //     .catch(() => {
        //         // on cancel
        //     });
        // },
        // 注册提交事件，
        async regFn() {
            const res = await docCheckPhone({
                tel: this.username
            })
            console.log(res.data);
            if (res.data.code != 200) {
                 Dialog.confirm({
                    message: '该手机号已被注册，是否直接登录',
                    confirmButtonText: '直接登录',
                    cancelButtonColor: "#999"
                })
                .then(() => {
                    this.$router.push('/login')
                })
                .catch(() => {
                    // on cancel
                });
            } else {
                Dialog.confirm({
                message: '我们将发送短信验证码到您的手机号',
                confirmButtonText: '确定',
                cancelButtonColor: "#999"
                })
                .then(() => {
                    sessionStorage.setItem("telFlag", "true")
                    this.$router.push('/sendCode/'+this.username)
                })
                .catch(() => {
                    // on cancel
                });
            }
        }
    },
};
</script>

<style lang="scss" scoped>
    .regBox{
        margin-top: 100px;
        padding: 0px 20px;
    }
    .next{
        margin-top: 30px;
    }
    .nextBtn{
        background: rgb(255, 102, 102);
        border: 1px solid rgb(255, 102, 102);
    }
</style>